.index-container {
  background-color: #fff;

  .van-nav-bar .van-icon {
    color: #333333;
  }

  .warpper {
    min-height: calc(100vh - 50px);

    .van-swipe__track {
      height: 333px;
    }

    .van-swipe {
      height: 167px;
      width: 100%;
      box-sizing: border-box;
      position: relative;
      background-color: #FAFAFA;
      .van-swipe-item{
        width: 100%;
        height: 100%;
      }
      img {
        width: 100%;
        height: 100%;
      }
    }

    .race-countdown {
      .flip-down {
        margin: 0 auto;
        margin-top: 8.7px !important;
        margin-bottom: 19px;
        text-align: center;

        .tip-title {
          color: #5e5e5e;
          margin-bottom: 4px !important;
        }
      }
    }

    .race-countdown {
      padding: 13px 15px 15px 15px;
      background-color: #f4f4f4;

      .title {
        font-size: 14px;
        color: #262626;
      }

      .text-tip {
        font-size: 10px;
        color: #6b6b6b;
        line-height: 17px;
        text-align: justify;

        span {
          display: block;
        }

        span::before {
          content: '';
          width: 2px;
          height: 2px;
          border-radius: 50%;
          display: inline-block;
          background: #6b6b6b;
          margin-right: 4px;
          vertical-align: middle;
        }
      }

      .tip-entries_name {
        margin-bottom: 3px;
        // font-size: 10px !important;
        color: #5E5E5E;
      }
    }

    .search-list {
      width: 100%;

      .search {
        padding: 7px 15px;

        .search-box {
          box-sizing: border-box;
          display: flex;
          width: 100%;
          height: 30px;
          background: #f7f7f7;
          border: 1px solid #F61E51;
          border-right: 0;
          padding-left: 10px;
          align-items: center;
          opacity: 1;
          border-radius: 7.5px 7.5px;
          justify-content: space-between;

          .search-flex {
            align-items: center;
            display: flex;

            .search-img {
              width: 12px;
              height: 12px;

              img {
                width: 100%;
                height: 100%;
              }
            }

            input {
              border: none;
              border-radius: 0;
              background-color: transparent;
              width: 250px;
              padding-left: 5px;
            }
          }

          .search-btn {
            background-color: #F61E51;
            border-radius: 0px 7.5px 7.5px 0px;
            color: #fff;
            width: 50px;
            text-align: center;
            font-size: 13px;
            line-height: 30px;
          }
        }
      }

      /deep/ .van-picker__confirm {
        color: #F61E51 !important;
      }

      .list-box {
        .bg {
          height: 45px;
          background: linear-gradient(90deg, #E71C5B 0%, #F9364B 20.98%, #FB7043 47.69%, #FFC355 90.55%, #C4F290 100.39%);

          color: #fff;
          display: flex;
          font-size: 12.5px;

          .flex {
            display: flex;
            align-items: center;
            padding: 3px 15px;
            height: 30px;

            .boder {
              border-right: 1px solid #fff;
              padding-right: 15px;
              margin-right: 15px;
            }
          }
        }

        .img-icon {
          width: 11px;
          height: 6px;
          margin-left: 6px;
        }

        .list-box2 {
          background: #fff;
          margin-top: -6px;
          border-radius: 6px 6px 0px 0;
          font-size: 12.5px;

          .class-item {
            padding: 12px 13px;
            display: flex;
            justify-content: space-between;

            .flex {
              display: flex;
            }

            .item {
              padding: 4px 9px;
              background: #e5e5e5;
              color: #828282;
              font-size: 12.5px;
              border-radius: 4px;
              margin-right: 10px;
            }

            .img {
              width: 9px;
              height: 10px;
              margin-left: 3px;
            }

            .hot-dec {
              margin-left: 0px;
            }

            .bg-hu {
              background: linear-gradient(270deg, #ffaf00 0%, #ff9e00 13%, #ff6e00 32%, #ff5100 63%, #F61E51 100%);
              color: #fff;
            }
          }
        }
      }

      .list-info {
        padding: 8px 15px 0;
        display: flex;

        .item {
          width: 48%;
          height: 199px;
          box-sizing: border-box;
		      overflow: hidden;
          border-radius: 4px;
          background: #fff;
          box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4);
          margin-bottom: 15px;
          display: inline-block;
          .img {
            width: 100%;
            height: 92px;
            position: relative;
            border-radius: 4px;
            img {
              width: 100%;
              height: 100%;
              object-fit: cover;
              border-radius: 4px;
            }

            .label {
              background-image: url(../../assets/img/search-icon.png);
              width: 26.5px;
              height: 22.5px;
              background-size: 100% 100%;
              position: absolute;
              top: 0;
              color: #fff;
              font-size: 12.5px;
              text-align: center;
              left: 10px;
            }
          }

          .cont-info {
            padding: 4px 6px 5px 6px;

            .addres {
              font-size: 10px;
              margin-top: 6px;
              display: flex;
              align-items: center;

              img {
                width: 12.5px;
                height: 11px;
                margin-right: 4px;
              }
            }

            .cont {
              line-height: 19px;
              .span {
                font-size: 12px;
                span {
                  font-size: 14px;
                }
              }

              .sapn1 {
                font-size: 10px;
              }
            }

            .vote {
              font-size: 18px;
              color: #F61E51;
              text-align: center;
              margin-top: 6px;
              line-height: 20px;
            }
          }

          .vote-btn {
            background: #F61E51;
            height: 33px;
            line-height: 33px;
            text-align: center;
            color: #fff;
            border-radius: 0 0 4px 4px;
          }

          .vote-btn.on {
            background-color: #e5e5e5;
            color: #999999;
          }
        }
      }
    }

   .van-popup {
      border-radius: 13px !important;
    }
    .noPopup{
      border-radius: 13px 13px 0 0 !important;
    }
    .search-popup {
      width: 200px;
      background: #fff;
      padding: 0px 32px;
      height: 223px;
      box-sizing: border-box;

      .title {
        color: #777777;
        font-size: 12px;
        text-align: center;

        .span1 {
          font-size: 16px;
          color: #F61E51;
          padding-top: 20px;
          margin-bottom: 6px;
        }

        .pt33 {
          padding-top: 33px;
        }

        .pb30 {
          padding-bottom: 12px;
        }

        .span {
          margin-bottom: 5px;
        }
      }

      .img {
        margin-top: 17px;
        margin-bottom: 17px;

        img {
          display: block;
          width: 54px;
          height: 54px;
          margin: 0 auto;
        }
      }

      .confirm {
        width: 119px;
        height: 31px;
        background: #F61E51;
        opacity: 1;
        border-radius: 15px;
        color: #fff;
        font-size: 15px;
        text-align: center;
        line-height: 31px;
        margin: 0 auto;
      }
    }
  }
}

.vote-end {
  color: #F61E51;
  font-size: 18px;
  margin: 10px 0;
  text-align: center;
}

.mt5 {
  margin-top: 5px;
}

.fixed {
  top: 0;
  position: sticky;
  z-index: 999;
}
.index-container .warpper .search-list .list-box .bg.fixed .flex{
  margin-top: 4px;
}
/deep/ .van-list{
  width: 100%;
}
a {
  color: inherit;
}
